import G6, {G6GraphEvent, Graph, INode, ModelConfig} from '@antv/g6';
import {G6Event, Item} from '@antv/g6-core/lib/types';
import ModeType from '../consts/mode-type';
import React from 'react';
import NodeType from '../consts/node-type';
import GraphEventName from '../consts/graph-event-name';
import GraphKeyName from '../consts/graph-key-name';
import StateType from '../consts/state-type';
import G6Util from "../utils/g6-util";

export default function () {
    G6.registerBehavior('custom:node:drop', {
        getDefaultCfg() {
            return {

            };
        },
        getEvents() {
            return {
                'custom:node:drop': 'handleNodeDrop'
            } as {
                [key in G6Event]?: string;
            };
        },
        handleNodeDrop(event: React.DragEvent | G6GraphEvent) {
            const graph = this.graph as Graph;
            const mode = graph.get(GraphKeyName.MODE);
            if (mode !== ModeType.NODE_ADD && mode !== ModeType.NODE_MOVE) {
                return ;
            }

            const dragNodeIds = graph.get(GraphKeyName.DRAG_NODE_IDS);

            if (dragNodeIds && dragNodeIds.length > 0) {
                dragNodeIds.forEach((dragNodeId: string) => {
                    const targetNode = graph.findById(dragNodeId);
                    // const nodeType = targetNode.getModel().type;
                    // const item = (event as unknown as G6GraphEvent).item as INode;
                    const model = targetNode.getModel();
                    const ghostId = `ghost-${model.id}`;
                    const ghostNode = graph.findById(ghostId);
                    // const { x, y } = event;
                    const targetX = ghostNode.getModel().x;
                    const targetY = ghostNode.getModel().y;
                    graph.updateItem(model.id as string, {...model, x: targetX, y: targetY}, true);
                });
            } else {

                let nodeType = NodeType.USER_TASK;
                if (!(event instanceof G6GraphEvent)) {
                    nodeType = ((event as React.DragEvent).target as HTMLElement).getAttribute('node-type') as string;
                }
                if (!nodeType) {
                    return ;
                }

                // 开始节点只能添加一个，是否已存在开始节点
                if (nodeType === NodeType.START_EVENT) {
                    const startNodes = graph.findAll('node', (node: any) => node.getModel().clazz === 'start-event' && node.getModel().id !== 'ghost');
                    if (startNodes.length > 1) {
                        // message.warning(i18n['message.startEvent.exists']);
                        graph.removeItem('ghost', false);
                        return ;
                    }
                }

                const currentGhost = graph.findById('ghost');
                const model = {
                    clazz: nodeType,
                    x: currentGhost.getModel().x,
                    y: currentGhost.getModel().y,
                    id: G6Util.generateNodeId(nodeType, 6),
                    type: nodeType,
                    label: nodeType
                } as ModelConfig;

                const item = graph.addItem('node', model, true) as Item;
                graph.emit('node:mouseenter', { item });
                graph.emit(GraphEventName.ITEMS_CLEAR_SELECT);
                graph.emit(GraphEventName.ITEM_SELECTED, item);
                // 选中节点
                item.setState(StateType.SELECTED, true);
                graph.emit(GraphEventName.ITEM_SELECTED,  item);
                graph.removeItem('ghost', false);
            }

        }
    });
}
